<template>
  <div>
    <!-- <a-switch v-model:checked="ellipsis" />
    <a-typography-paragraph
      :ellipsis="ellipsis"
      content=" Ant Design, a design language for background applications, is refined by Ant UED Team. Ant
    Design, a design language for background applications, is refined by Ant UED Team. Ant
    Design, a design language for background applications, is refined by Ant UED Team. Ant
    Design, a design language for background applications, is refined by Ant UED Team. Ant
    Design, a design language for background applications, is refined by Ant UED Team. Ant
    Design, a design language for background applications, is refined by Ant UED Team."
    />
    <a-typography-paragraph
      v-model:content="editableStr"
      editable
    />
    <a-typography-paragraph copyable>This is a copyable text.</a-typography-paragraph>
    <a-typography-paragraph :copyable="{ tooltip: false }">
      Hide Copy tooltips.
    </a-typography-paragraph>
    <a-space direction="vertical">
      <a-typography-text>Ant Design Vue (default)</a-typography-text>
      <a-typography-text type="secondary">Ant Design Vue (secondary)</a-typography-text>
      <a-typography-text type="success">Ant Design Vue (success)</a-typography-text>
      <a-typography-text type="warning">Ant Design Vue (warning)</a-typography-text>
      <a-typography-text type="danger">Ant Design Vue (danger)</a-typography-text>
    </a-space> -->
    <a-slider
      v-model:value="rows"
      :min="1"
      :max="10"
      @change="toChange"
    />
    <a-typography-paragraph
      :ellipsis="ellipsis"
      :title="`${article}--William Shakespeare`"
      :content="article"
    ></a-typography-paragraph>
    <a-typography-title>h1. Ant Design Vue</a-typography-title>
    <a-typography-title :level="2">h2. Ant Design Vue</a-typography-title>
  </div>
</template>

<script>
export default {
  name: '',
  components: {},
  data() {
    return {
      ellipsis: false,
      editableStr: '这里是一些文字',
      article: '这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字这里是一些文字',

      rows: 1,
      ellipsis: {}

    }
  },
  created() { },
  mounted() {
    this.ellipsis = {
      rows: this.rows,
      expandable: true,
      suffix: '--William Shakespeare',
    }
  },
  methods: {
    toChange(e) {
      this.ellipsis.rows = e
    }
  },

}
</script>
<style scoped lang='scss'>
</style>
